<style>
    .relation-item {
        margin-top: 10px;
    }

    legend {
        padding-bottom: 5px;
        font-size: 14px;
        font-weight: 600;
    }

    legend text {
        cursor: pointer;
    }

    label {
        font-weight: normal;
    }

    .form-control {
        padding: 6px 8px;
    }

    #extend-zone .col-xs-2 {
        margin-top: 10px;
        padding-right: 0;
    }

    #extend-zone .col-xs-2:nth-child(6n+0) {
        padding-right: 15px;
    }
    .tab-pane {
        padding: 0 6px;
    }
    .popover {
        max-width: 600px !important;
    }
    .alert {
        font-size: 12px;
    }
    #field-zone tbody td{
        vertical-align: middle;
    }
    #menu-tips {
        padding-top: 12px;
    }
    .btn-collapse {
        width: 60px;
        position: absolute;
        right: 0;
    }
    .table {
        margin-bottom: 0;
    }
    .table thead th {
        font-size: 12px;
        vertical-align: middle !important;
    }
    .btn-submit {
        width:20%;
        min-width:100px;
    }
</style>
<div class="alert alert-info alert-dismissible" role="alert">
    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span
            aria-hidden="true">&times;</span></button>
    <strong>提示：</strong><br />
    在生成小程序控制器前，请确保你的FastAdmin后台<strong>PC端代码</strong>（包括数据表、菜单规则、模型类）已经开发或生成；<br />
    你可以使用FastAdmin的<strong>一键生成CRUD</strong>和<strong>一键生成菜单</strong>完成前期工作。
</div>
<div class="nav-tabs-custom tab-info">
    <ul class="nav nav-tabs">
        <li class="active">
            <a href="#tab-controller" data-toggle="tab" aria-expanded="true"><i class="fa fa-flash"></i> 一键生成小程序控制器</a>
        </li>
    </ul>
    <div class="tab-content">
        <div class="tab-pane active fade in" id="tab-controller">
            <form role="form" id="form-controller" data-validator-option="{bindClassTo:'.control-box', msgMaker:false}">
                <legend><text>第一步：选择菜单和数据表</text></legend>
                <div class="row">
                    <div class="col-xs-3">
                        <div class="form-group">
                            <label>菜单规则 (必选) <i class="text-info fa fa-question-circle" data-toggle="popover" title="菜单规则" data-content="相对应的FastAdmin<code>PC端</code>菜单规则<br/>"></i></label>
                            <div class="control-box">
                                <select class="form-control selectpicker" data-width="100%" title="请选择" name="menu" data-rule="required">
                                    {volist name="ruledata" id="item"}
                                    <option value="{$item.rule}" data-name="{$item.rule}" 
                                        data-content="
                                            {$item.title} 
                                            {if (!$item.haschild && $item.id < 85)}
                                                <small class='pull-right text-warning'><i class='fa fa-warning'></i> 系统核心菜单</small>
                                            {/if}
                                            {if (!$item.haschild && (stripos($item.rule,'helper') === 0 || stripos($item.rule,'helper') === 1))}
                                                <small class='pull-right text-warning'><i class='fa fa-warning'></i> 助手核心菜单</small>
                                            {/if}
                                        " 
                                        {if ($item.haschild)} disabled {/if}
                                    >
                                        {$item.title}
                                    </option>
                                    {/volist}
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-3">
                        <label>主表 (必选) <i class="text-info fa fa-question-circle" data-toggle="popover" title="主表" data-content="选择与<code>菜单规则</code>相对应的数据表"></i></label>
                        <div class="control-box">
                            {:build_select('table',$tableList,null,['class'=>'form-control selectpicker','data-width' => '100%', 'data-rule' => 'required', 'title' => '请选择']);}
                        </div>
                    </div>
                    <div class="col-xs-3">
                        <label>是否全局模型类 <i class="text-info fa fa-question-circle" data-toggle="popover" title="是否全局模型类" data-content="模型类文件的位置<br/><strong>否</strong>：模型类文件位于<code>application/admin/model</code><br/><strong>是</strong>：模型类文件位于<code>application/common/model</code><br/><br/><small>如果模型使用了自定义路径，可在控制器生成后修改<code>$this->model</code></small>"></i></label>
                        <select class="form-control selectpicker" data-width="100%" title="不使用" name="local">
                            <option data-subtext="<code>application/admin/model</code>" value="1" selected>否</option>
                            <option data-subtext="<code>application/common/model</code>" value="0">是</option>
                        </select>
                    </div>
                    <div class="col-xs-3">
                        <label>是否覆盖模式 <i class="text-info fa fa-question-circle" data-toggle="popover" title="是否覆盖模式" data-content="是否强制覆盖已经存在同名文件，请做好文件备份。"></i></label>
                        <select class="form-control selectpicker" data-width="100%" title="不使用" name="force">
                            <option value="0" selected>否</option>
                            <option value="1">是</option>
                        </select>
                    </div>
                </div>
                <div class="row">
                    <div id="menu-tips" class="col-xs-12 hide">将生成小程序控制器:
                        <strong class="text-success"></strong>
                    </div>
                </div>
                <div class="row hide" id="config-zone">
                    <br />
                    <div class="col-xs-12">
                        <legend><text>第二步：列表页配置</text> </legend>
                        <div>
                            <div class="row">
                                <div class="col-xs-3">
                                    <div class="form-group">
                                        <label>记录名 (必填) <i class="text-info fa fa-question-circle" data-toggle="popover" title="单条记录的名称<code>model</code>" data-content="例如<code>日志</code><code>订单</code><code>会员</code><code>文章</code><br/><small>建议不操作3个汉字</small>"></i></label>
                                        <div class="control-box">
                                            <input type="text" name="model" class="form-control" style="width: 100%;" data-rule="required">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-xs-3">
                                    <div class="form-group">
                                        <label>支持的默认操作 <i class="text-info fa fa-question-circle" data-toggle="popover" title="支持的默认控制器操作方法<code>auth</code>" data-content="<strong>添加</strong>：对应控制器的<code>add</code>方法，若未勾选，「列表页」将不会出现「添加」按钮；<br/><strong>编辑</strong>：对应控制器的<code>edit</code>方法，若未勾选，「详情页」将不会出现「编辑」按钮；<br/><strong>删除</strong>：对应控制器的<code>del</code>方法，若未勾选，「列表页」进行<u>批量</u>操作和「编辑页」进行<u>更多</u>操作时将不会出现「删除」按钮。<br/><br/><small>以上3个方法定义在基类控制器中，你可以在生成的控制器中<u>重写</u>各方法，以实现自定义逻辑。</small>"></i></label>
                                        <select class="form-control selectpicker" data-width="100%" title="不使用" name="auth[]" multiple>
                                            <option data-subtext="add" value="add" selected>添加</option>
                                            <option data-subtext="edit" value="edit" selected>编辑</option>
                                            <option data-subtext="del" value="del" selected>删除</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-xs-3">
                                    <div class="form-group">
                                        <label>功能按钮 <i class="text-info fa fa-question-circle" data-toggle="popover" title="列表页头部功能按钮" data-content="未选择的功能按钮将不显示"></i></label>
                                        <div class="control-box">
                                            <select class="form-control select-buttons selectpicker" data-width="100%" title="不使用" name="buttons[]" multiple>
                                                <option data-subtext="sort" value="sort" selected>排序</option>
                                                <option data-subtext="multi" value="multi" selected>多选</option>
                                                <option data-subtext="search" value="search" selected>搜索</option>
                                                <option data-subtext="filter" value="filter" selected>筛选</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-xs-3">
                                    <div class="form-group">
                                        <label>选项卡 <i class="text-info fa fa-question-circle" data-toggle="popover" title="是否使用列表页头部选项卡<code>tabList</code>" data-content="<small>仅支持字段注释格式为<code>字段名:0=状态0,1=状态1,2=状态2</code>的enum字段（即识别为<strong>单选</strong>组件的字段）</small>"></i></label>
                                        <div id="tabs">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-xs-3">
                                    <div class="form-group">
                                        <label>列表页字段 (必选) <i class="text-info fa fa-question-circle" data-toggle="popover" title="列表页字段<code>list.field</code>" data-content="列表页数据行中要展示的字段<br/><br/><small><strong>注意：选中的字段需同时在「字段配置」中勾选</strong><br/>移动端展示空间有限，不宜选择过多。</small>"></i></label>
                                        <div class="control-box">
                                            <select id="listField" class="form-control selectpicker" data-width="100%" title="请选择" name="list[field][]" data-rule="required" data-selected-text-format="count > 3" data-count-selected-text=" 已选{0}项" data-actions-box="true" data-select-all-text="全部选中" data-deselect-all-text="取消全选" multiple>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-xs-3">
                                    <div class="form-group">
                                        <label>指定标题字段 (必选) <i class="text-info fa fa-question-circle" data-toggle="popover" title="标题字段<code>list.titleField</code>" data-content="数据行中作为标题的字段<br/><br/><strong>注意：选中的字段需同时在「字段配置」中勾选</strong><br/><small>将展示在数据行顶部位置</small>"></i></label>
                                        <div class="control-box">
                                            <select id="listTitleField" class="form-control selectpicker" data-width="100%" title="请选择" name="list[titleField]" data-rule="required">
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-xs-3">
                                    <div class="form-group">
                                        <label>指定缩略图字段 <i class="text-info fa fa-question-circle" data-toggle="popover" title="缩略图字段<code>list.imageField</code>" data-content="数据行中作为缩略图的字段<br/><br/><strong>注意：选中的字段需同时在「字段配置」中勾选</strong><br/><small>将展示在数据行左侧位置</small>"></i></label>
                                        <div class="control-box">
                                            <select id="listImageField" class="form-control selectpicker" data-width="100%" name="list[imageField]" title="不使用" multiple data-max-options="1">
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-xs-3">
                                    <div class="form-group">
                                        <label>指定状态字段 <i class="text-info fa fa-question-circle" data-toggle="popover" title="状态字段<code>list.statusField</code>" data-content="数据行右上角展示的状态字段<br/><br/><strong>注意：选中的字段需同时在「字段配置」中勾选</strong><br/><br/><small>仅支持字段注释格式为<code>字段名:0=状态0,1=状态1,2=状态2</code>的enum字段（即识别为<strong>单选</strong>组件的字段）</small>"></i></label>
                                        <div id="statusField" class="control-box">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row hide" id="field-zone">
                    <br />
                    <div class="col-xs-12">
                        <legend><text>第三步：字段配置 <small class="text-info">(以下为自动识别结果，请根据实际情况调整)</small></text></legend>
                        <table class="table table-bordered table-hover">
                            <thead>
                                <tr>
                                    <th style="min-width:50px;text-align: center;">展示<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="是否使用(展示)该字段 <code>show</code>" data-content="<small>未勾选的字段在前端任何页面均不展示，可不配置。</small>"></i></th>
                                    <th style="min-width:100px;text-align:center">字段名<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="字段名" data-content="数据表中的字段名"></i></th>
                                    <th style="width:90px;text-align:center">字段类型<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="字段类型" data-content="数据表中的字段类型"></i></th>
                                    <th style="width:120px;text-align:center">字段标题<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="字段标题 (必填)  <code>label</code>" data-content="该字段在前端展示的名称/标题<br/><small>默认通过<code>字段注释</code>自动识别</small>"></i></th>
                                    <th style="width:110px;text-align:center">组件类型<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="组件类型 <code>type</code>" data-content="前端「编辑页」使用的表单组件类型<br/><small>默认通过<code>字段类型</code>自动识别</small>"></i></th>
                                    <th style="width:110px;text-align:center">表单验证<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="表单验证 <code>rules</code>" data-content="前端「编辑页」中该字段的表单验证规则<br/><small>默认<code>无</code></small>"></i></th>
                                    <th style="text-align:center" class="field-sort">可排序<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="可排序 <code>sortable</code>" data-content="是否在前端「数据列表页」支持该字段排序<br/><small>默认<code>false</code></small>"></i></th>
                                    <th style="text-align:center" class="field-filter">可筛选<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="可筛选 <code>filterable</code>" data-content="是否在前端「数据列表页」支持该字段筛选<br/><small>默认<code>false</code></small>"></i></th>
                                    <th style="text-align:center" class="field-filter">筛选语法<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="筛选语法 <code>op</code>" data-content="筛选时的查询语法<br/>datetime型范围须使用<code>RANGE</code><br/>数字型范围须使用<code>BETWEEN</code>"></i></th>
                                    <th style="text-align:center">可查看<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="可查看 <code>viewable</code>" data-content="是否在前端「详情页」展示该字段<br/><small>默认<code>true</code></small>"></i></th>
                                    <th style="text-align:center">可编辑<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="可编辑 <code>editable</code>" data-content="是否在前端「编辑页」展示该字段<br/><small>默认<code>true</code></small>"></i></th>
                                    <th style="text-align:center">可添加<br/> <i class="text-info fa fa-question-circle" data-toggle="popover" title="可添加 <code>addable</code>" data-content="是否在前端「添加页」展示该字段<br/><small>默认<code>true</code></small>"></i></th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="row text-center" style="margin-top: 12px;">
                    <button type="button" class="btn btn-success btn-submit">生成</button>
                </div>
            </form>
        </div>
    </div>
</div>
<script id="tabstpl" type="text/html">
    <select class="form-control selectpicker" title="不使用" data-width="100%" name="tabField" multiple data-max-options="1">
        <% for(var t=0;t < tabList.length;t++){ %>
        <option value="<%=tabList[t].value%>">
            <%=tabList[t].name%>
        </option>
        <% } %>
        <% if (tabList.length === 1 ) { %>
            <option disabled>该表无enum字段</option>
        <% } %>
    </select>
</script>
<script id="statusfieldtpl" type="text/html">
    <select class="form-control selectpicker" title="不使用" data-width="100%" name="list[statusField]" multiple data-max-options="1">
        <% for(var t=0;t < tabList.length;t++){ %>
        <option value="<%=tabList[t].value%>">
            <%=tabList[t].name%>
        </option>
        <% } %>
        <% if (tabList.length === 1 ) { %>
            <option disabled>该表无enum字段</option>
        <% } %>
    </select>
</script>
<script id="fieldtpl" type="text/html">
    <% for(var i=0;i < fieldList.length;i++){ %>
        <option value="<%=fieldList[i].COLUMN_NAME%>" data-subtext="<%=fieldList[i].DATA_TYPE%>">
            <%=fieldList[i].COLUMN_NAME%>
        </option>
    <% } %>
</script>
<script id="fieldzonetpl" type="text/html">
    <% for(var i=0;i < fieldList.length;i++){ %>
    <% var item=fieldList[i]; %>
    <% if (['deletetime'].indexOf(item.COLUMN_NAME) === -1) { %>
    <tr>
        <!-- 展示 -->
        <td class="text-center">
            <input type="checkbox" name="field[<%=item.COLUMN_NAME%>][show]" 
            <% if ( item.COLUMN_NAME !== 'deletetime' ) { %>
                checked
            <% } %>
            >
        </td>
        <!-- 字段名 -->
        <td><%=item.COLUMN_NAME%></td>
        <!-- 字段类型 -->
        <td>
            <%=item.DATA_TYPE%> 
            <i class="text-muted fa fa-info-circle" data-toggle="popover" title="字段信息"" data-content="<small>类型:<code><%=item.COLUMN_TYPE%></code><br/>默认值: 
                <% if ( item.COLUMN_DEFAULT === '' ) { %>
                    <code>''</code>
                <% } else if (item.COLUMN_DEFAULT === null) { %>
                    <code>null</code>
                <% } else { %>
                    <code><%=item.COLUMN_DEFAULT%></code>
                <% } %>
            </code><br/>注释:<code><%=item.COLUMN_COMMENT%></code></small>"></i>
        </td>
        <!-- 字段标题 -->
        <td class="control-box">
            <input class="form-control" name="field[<%=item.COLUMN_NAME%>][label]" value="<%=item.label%>" data-rule="required"/>
        </td>
        <!-- 组件类型 -->
        <td>
            <% var typeList = [
            { name: '字符', value: 'text' },
            { name: '密码', value: 'password' },
            { name: '整数', value: 'number' },
            { name: '数字(带小数点)', value: 'digit' },
            { name: '身份证', value: 'idcard' },
            { name: '年', value: 'year' },
            { name: '日期', value: 'date' },
            { name: '时间', value: 'time' },
            { name: '日期时间', value: 'datetime' },
            { name: '单选', value: 'select' },
            { name: '多选', value: 'selects' },
            { name: '开关', value: 'switch' },
            { name: '图片', value: 'image' },
            { name: '图片(多)', value: 'images' },
            { name: '文件', value: 'file' },
            { name: '文件(多)', value: 'files' },
            { name: '文本框', value: 'textarea' },
            { name: '富文本', value: 'editor' }
            ]; %>
            <select class="form-control selectpicker" name="field[<%=item.COLUMN_NAME%>][type]">
                <% for(var t=0;t < typeList.length;t++){ %>
                    <% if (item.type.typeList.indexOf(typeList[t].value) !== -1) { %>
                    <option value="<%=typeList[t].value%>" data-subtext="<%=typeList[t].value%>" 
                        <% if ( item.type.inputType === typeList[t].value ) { %>
                        selected
                        <% } %>
                    >
                        <%=typeList[t].name%>
                    </option>
                    <% } %>
                <% } %>
            </select>
        </td>
        <!-- 表单验证 -->
        <td>
            <% var rulesList = [
            { name: '必填', value: 'required' },
            { name: '电子邮件', value: 'email' },
            { name: 'QQ号码', value: 'qq' },
            { name: '手机号码', value: 'mobile' },
            { name: '座机号码', value: 'tel' },
            { name: '网址', value: 'url' },
            { name: '邮编', value: 'zipcode' },
            { name: '日期', value: 'date' },
            { name: '时间', value: 'time' },
            { name: '整数', value: 'number' },
            { name: '数字', value: 'digits' },
            { name: '金额', value: 'money' },
            { name: '身份证', value: 'idcard' },
            { name: '用户名', value: 'username' },
            { name: '密码', value: 'password' },
            { name: '字母', value: 'letters' },
            { name: '中文', value: 'chinese' }
            ]; %>
            <select class="form-control selectpicker" name="field[<%=item.COLUMN_NAME%>][rules][]" title="请选择" data-selected-text-format="count" data-count-selected-text=" 已选{0}项" multiple>
                <% for(var r=0;r < rulesList.length;r++){ %>
                <option value="<%=rulesList[r].value%>" data-subtext="<%=rulesList[r].value%>">
                    <%=rulesList[r].name%>
                </option>
                <% } %>
            </select>
        </td>
        <!-- 可排序 -->
        <td style="text-align:center" class="field-sort">
            <input id="<%=item.COLUMN_NAME%>-sortable" name="field[<%=item.COLUMN_NAME%>][sortable]" class="form-control" type="hidden" value="0" />
            <a href="javascript:;" data-toggle="switcher" class="btn-switcher " data-input-id="<%=item.COLUMN_NAME%>-sortable" data-yes="1" data-no="0">
                <i class="fa fa-toggle-on text-success fa-flip-horizontal text-gray fa-2x"></i>
            </a>
        </td>
        <!-- 可筛选 -->
        <td style="text-align:center" class="field-filter">
            <input id="<%=item.COLUMN_NAME%>-filterable" name="field[<%=item.COLUMN_NAME%>][filterable]" class="form-control" type="hidden" value="0" data-name="<%=item.COLUMN_NAME%>" />
            <a href="javascript:;" data-toggle="switcher" class="btn-switcher " data-input-id="<%=item.COLUMN_NAME%>-filterable" data-yes="1" data-no="0">
                <i class="fa fa-toggle-on text-success fa-flip-horizontal text-gray fa-2x"></i>
            </a>
        </td>
        <!-- 筛选语法 -->
        <td class="field-filter">
            <!-- 支持的语法列表 -->
            <!-- ['=','!=','LIKE','NOT LIKE','>','<','>=','<=','IN','NOT IN','FIND_IN_SET','BETWEEN','NOT BETWEEN','RANGE','NOT RANGE','NULL','NOT NULL'] -->
            <div class="selectpicker-warpper">
                <select class="form-control selectpicker" name="field[<%=item.COLUMN_NAME%>][op]">
                    <% for(var ii=0;ii < item.type.opList.length;ii++){ %>
                        <option value="<%=item.type.opList[ii]%>"><%=item.type.opList[ii]%></option>
                    <% } %>
                </select>
            </div>
        </td>
        <!-- 可查看 -->
        <td style="text-align:center">
            <input id="<%=item.COLUMN_NAME%>-viewable" name="field[<%=item.COLUMN_NAME%>][viewable]" class="form-control" type="hidden" value="1" />
            <a href="javascript:;" data-toggle="switcher" class="btn-switcher " data-input-id="<%=item.COLUMN_NAME%>-viewable" data-yes="1" data-no="0">
                <i class="fa fa-toggle-on text-success fa-2x"></i>
            </a>
        </td>
        <!-- 可编辑 -->
        <td style="text-align:center">
            <% if (['createtime','updatetime','deletetime'].indexOf(item.COLUMN_NAME) !== -1) { %>
                <input id="<%=item.COLUMN_NAME%>-editable" name="field[<%=item.COLUMN_NAME%>][editable]" class="form-control" type="hidden" value="0" />
            <% } else { %>
                <input id="<%=item.COLUMN_NAME%>-editable" name="field[<%=item.COLUMN_NAME%>][editable]" class="form-control" type="hidden" value="1" />
                <a href="javascript:;" data-toggle="switcher" class="btn-switcher " data-input-id="<%=item.COLUMN_NAME%>-editable" data-yes="1" data-no="0">
                    <i class="fa fa-toggle-on text-success fa-2x"></i>
                </a>
            <% } %>
        <!-- 可添加 -->
        <td style="text-align:center">
            <% if (['createtime','updatetime','deletetime'].indexOf(item.COLUMN_NAME) !== -1) { %>
                <input id="<%=item.COLUMN_NAME%>-addable" name="field[<%=item.COLUMN_NAME%>][addable]" class="form-control" type="hidden" value="0" />
            <% } else { %>
                <input id="<%=item.COLUMN_NAME%>-addable" name="field[<%=item.COLUMN_NAME%>][addable]" class="form-control" type="hidden" value="1" />
                <a href="javascript:;" data-toggle="switcher" class="btn-switcher " data-input-id="<%=item.COLUMN_NAME%>-addable" data-yes="1" data-no="0">
                    <i class="fa fa-toggle-on text-success fa-2x"></i>
                </a>
            <% } %>
        </td>
    </tr>
    <%}%>
    <%}%>
</script>
<script id="relationtpl" type="text/html">
    <div class="row relation-item">
        <div class="col-xs-2">
            <label>请选择关联表</label>
            <select name="relation[<%=index%>][relation]" class="form-control relationtable"></select>
        </div>
        <div class="col-xs-2">
            <label>请选择关联类型</label>
            <select name="relation[<%=index%>][relationmode]" class="form-control relationmode"></select>
        </div>
        <div class="col-xs-2">
            <label>关联外键</label>
            <select name="relation[<%=index%>][relationforeignkey]" class="form-control relationforeignkey"></select>
        </div>
        <div class="col-xs-2">
            <label>关联主键</label>
            <select name="relation[<%=index%>][relationprimarykey]" class="form-control relationprimarykey"></select>
        </div>
        <div class="col-xs-2">
            <label>请选择显示字段</label>
            <select name="relation[<%=index%>][relationfields][]" multiple class="form-control relationfields"></select>
        </div>
        <div class="col-xs-2">
            <label>&nbsp;</label>
            <a href="javascript:;" class="btn btn-danger btn-block btn-removerelation">移除</a>
        </div>
    </div>
</script>